---
title: Next.js Examples
nav_title: Examples
description: Examples of popular Next.js UI patterns and use cases.
---

{/* The content of this doc is shared between the app and pages router. You can use the `<PagesOnly>Content</PagesOnly>` component to add content that is specific to the Pages Router. Any shared content should not be wrapped in a component. */}

### Data Fetching

- [Using the `fetch` API](/docs/app/building-your-application/data-fetching/fetching#fetching-data-on-the-server-with-the-fetch-api)
- [Using an ORM or database client](/docs/app/building-your-application/data-fetching/fetching#fetching-data-on-the-server-with-an-orm-or-database)
- [Reading search params on the server](/docs/app/api-reference/file-conventions/page)
- [Reading search params on the client](/docs/app/api-reference/functions/use-search-params)

### Revalidating Data

- [Using ISR to revalidate data after a certain time](/docs/app/building-your-application/data-fetching/incremental-static-regeneration#time-based-revalidation)
- [Using ISR to revalidate data on-demand](/docs/app/building-your-application/data-fetching/incremental-static-regeneration#on-demand-revalidation-with-revalidatepath)

### Forms

- [Showing a pending state while submitting a form](/docs/app/building-your-application/data-fetching/server-actions-and-mutations#pending-states)
- [Server-side form validation](/docs/app/building-your-application/data-fetching/server-actions-and-mutations#server-side-form-validation)
- [Handling expected errors](/docs/app/building-your-application/routing/error-handling#handling-expected-errors-from-server-actions)
- [Handling unexpected exceptions](/docs/app/building-your-application/routing/error-handling#uncaught-exceptions)
- [Showing optimistic UI updates](/docs/app/building-your-application/data-fetching/server-actions-and-mutations#optimistic-updates)
- [Programmatic form submission](/docs/app/building-your-application/data-fetching/server-actions-and-mutations#programmatic-form-submission)

### Server Actions

- [Passing additional values](/docs/app/building-your-application/data-fetching/server-actions-and-mutations#passing-additional-arguments)
- [Revalidating data](/docs/app/building-your-application/data-fetching/server-actions-and-mutations#revalidating-data)
- [Redirecting](/docs/app/building-your-application/data-fetching/server-actions-and-mutations#redirecting)
- [Setting cookies](/docs/app/api-reference/functions/cookies#methods)
- [Deleting cookies](/docs/app/api-reference/functions/cookies#deleting-cookies)

### Metadata

- [Creating an RSS feed](/docs/app/building-your-application/routing/route-handlers#non-ui-responses)
- [Creating an Open Graph image](/docs/app/api-reference/file-conventions/metadata/opengraph-image)
- [Creating a sitemap](/docs/app/api-reference/file-conventions/metadata/sitemap)
- [Creating a robots.txt file](/docs/app/api-reference/file-conventions/metadata/robots)
- [Creating a custom 404 page](/docs/app/api-reference/file-conventions/not-found)
- [Creating a custom 500 page](/docs/app/api-reference/file-conventions/error)

### Auth

- [Creating a sign-up form](/docs/app/building-your-application/authentication#sign-up-and-login-functionality)
- [Stateless, cookie-based session management](/docs/app/building-your-application/authentication#stateless-sessions)
- [Stateful, database-backed session management](/docs/app/building-your-application/authentication#database-sessions)
- [Managing authorization](/docs/app/building-your-application/authentication#authorization)

### Testing

- [Vitest](/docs/app/building-your-application/testing/vitest)
- [Jest](/docs/app/building-your-application/testing/jest)
- [Playwright](/docs/app/building-your-application/testing/playwright)
- [Cypress](/docs/app/building-your-application/testing/cypress)

### Deployment

- [Creating a Dockerfile](/docs/app/building-your-application/deploying#docker-image)
- [Creating a static export (SPA)](/docs/app/building-your-application/deploying/static-exports)
- [Configuring caching when self-hosting](/docs/app/building-your-application/deploying#configuring-caching)
- [Configuring Image Optimization when self-hosting](/docs/app/building-your-application/deploying#image-optimization)
